<template>
    <nav class="navbar navbar-expand-lg bg-body-tertiary">
        <div class="container">
            <img class="logo" src="../assets/QQ图片20220530151354.png" alt="图片"> |
            <router-link :to="{name : 'home'}" class="navbar-brand break" href="#">医学影像分割系统</router-link>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarText" aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarText">
            <ul class="navbar-nav me-auto mb-2 mb-lg-0">           
            </ul>
            <ul class="navbar-nav">
                <li class="nav-item">
                <router-link :to="{name : 'login'}" class="nav-link">登录</router-link>
                </li>
                <li class="nav-item">
                <router-link :to="{name: 'rigester'}" class="nav-link" href="#">注册</router-link>
                </li>
            </ul>
            </div>
        </div>
    </nav>
</template>

<style scoped>
.logo{
    height: 30px;   
    margin-right: 10px;
    position: relative;
    border-radius: 50%;
}
.break{
    margin-left: 10px;
}
</style>

<script>
    export default{
        name: 'NavBar',
    }
</script>